<template>
  <div class="page-box">
    <dataList
      placeholder="请输入项目名称"
      :pageInfo="pager"
      :listData="tableData"
      :selectData="selectDataArr"
      searchName="projectName"
      :menuList="['add','export']"
      :filterList="filterList"
      @menu-click="handleMenuClick"
    >
      <el-table :data="tableData" align="center" ref="multipleTable" @selection-change="$event => (selectDataArr = $event)">
        <el-table-column label="项目编号" prop="projectCode"></el-table-column>
        <el-table-column label="项目名称" prop="projectName"></el-table-column>
        <el-table-column label="项目面积(m²)" prop="projectArea"></el-table-column>
        <el-table-column label="项目类型" prop="projectType"></el-table-column>
        <el-table-column label="项目街道" prop="projectStreet"></el-table-column>
        <el-table-column label="项目位置" prop="addressInfo"></el-table-column>
        <el-table-column width="200px" label="操作">
          <template slot-scope="scope">
            <el-button type="text" @click="handleConstruction(scope.row)">编辑</el-button>
            <el-button type="text" v-if="scope.row.transferConditions == '1'" @click="handleToTransfer(scope.row)">提交</el-button>
          </template>
        </el-table-column>
      </el-table>
    </dataList>
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
import { underconstructionPage, turnOver } from '../api/construction'
export default {
  name: "project-index",
  provide () {
    return {
      initList: this.getListData
    };
  },
  beforeMount () {
    this.getListData();
  },
  mounted () {
    this.add_construction = this.permissions["underconstruction_edit"];
    this.export_construction = this.permissions["underconstruction_get"];
  },
  data () {
    return {
      // hxf-0827-表单绑定
      tableData: [],
      // 请求参数
      params: {
        current: 1,
        size: 20,
        projectName: ""
      },
      // 选中的数据
      selectDataArr: [],
      // 分页
      pager: {
        total: 0, // 总页数
        current: 1, // 当前页数
        size: 20 // 每页显示多少条
      },
      // 页面loading
      loading: false,
      filterList: [
        {
          label: "项目类型",
          inputType: "dict",
          dictName: "project_types",
          name: "projectType",
          multiple: true
        },
        {
          label: "项目街道",
          inputType: "dict",
          dictName: "streets",
          name: "projectStreet",
          multiple: true
        }
      ],
      // hxf-0901-权限配置初始值
      add_construction: false,
      export_construction: false,
      //hxf-0901-传个编辑的标识
      isEdit: ""
    };
  },
  computed: {
    ...mapGetters(["permissions"])
  },
  methods: {
    // hxf-0903-分页接口
    getListData (params = {}) {
      this.loading = true;
      let requestData = { ...this.params, ...params };
      underconstructionPage(requestData)
        .then(res => {
          const { current, size, total, records } = res.data.data;
          this.tableData = records;
          this.params = requestData;
          this.pager = { total, current, size };
        })
        .finally(() => {
          this.loading = false;
        });
    },
    // 菜单点击监听
    handleMenuClick (type) {
      switch (type) {
        case "add":
          this.$router.push({ name: "construction_add" });
          break;
        case "export":
          this.exportTable();
          break;
        default:
          this.$message(type);
          break;
      }
    },
    // hxf-0827-导出
    exportTable () {
      this.publicExport('在建项目', '/api/underconstruction/download', this.params)
    },
    // hxf-0827-编辑
    handleConstruction (row) {
      this.$router.push({
        name: "construction_edit",
        query: { isEdit: row.projectId }
      });
    },
    // hxf-0904-推进到移交
    handleToTransfer (row) {
      this.$confirm(
        "该动作是将此项目提交到“项目接收” ，您确认要继续操作？",
        {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }
      ).then(() => {
        turnOver(row.projectId).then(res => {
          if (res.data.code === 0) {
            this.$message.success("已成功推送到项目接收！");
            this.getListData();
          }
        });
      });
    }
  }
};
</script>
